<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>

		<div>发送消息：</div>
		<input type="text" id="msgContent" />
		<input type="button" value="发送" onclick="CHAT.chat()" />

		<div>接收消息：</div>
		<div id="receiveMsg" style="background-color: gainsboro"></div>

		<script type="application/javascript">
			window.CHAT = {
				socket: null,
				init: function() {
					if (window.WebSocket) {
						//ip：10.0.0.14是本机或服务器地址
						CHAT.socket = new WebSocket("ws:ip：10.0.0.14:8088/ws");
						CHAT.socket.onopen = function() {
								console.log("客户端与服务端连接建立成功。。。");
							},
							CHAT.socket.onerror = function() {
								console.log("发生错误。。。");
							},
							CHAT.socket.onclose = function() {
								console.log("客户端与服务端连接关闭。。。");
							},
							CHAT.socket.onmessage = function(e) {
								console.log("收到消息：" + e.data);
								var receiveMsg = document.getElementById("receiveMsg");
								var html = receiveMsg.innerHTML;
								receiveMsg.innerHTML = html + "<br/>" + e.data;
							}
					} else {
						alert("浏览器不支持webSocket协议，请更换更高版本的浏览器");
					}
				},
				chat: function() {
					var msgContent = document.getElementById("msgContent");
					CHAT.socket.send(msgContent.value);
				}
			}

			CHAT.init();
		</script>
	</body>
</html>
